<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>科教招新系统运营后台</title>


    <!-- 引入框架 -->
    <!-- Vue + jQuery + ElementUI + CloudBase -->
    <!-- Vue -->
    <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.7.8"></script> -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-1.12.4.js"
        integrity="sha256-Qw82+bXyGq6MydymqBxNPYTaUXXq7c8v3CwiYwLLNXU=" crossorigin="anonymous"></script>
    <script
        src="./static/js/jq22Fixed-Header-Table-master486220161013/Fixed-Header-Table-master20161013/jquery.fixedheadertable.min.js"></script>
    <!-- ElementUI -->
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" />
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <!-- 云开发Web SDK -->
    <script src="https://res.wx.qq.com/open/js/cloudbase/1.1.0/cloud.js"></script>
    <!--  特点：
    1.直接在Windows对象上挂载cloud对象，在使用时直接cloud即可
        配置过程
        1.使用new cloud创建对象，传入对应的资源id和APPID
        2.使用cloud对象中的inti方法进行初始化
-->
    <link rel="stylesheet" href="./static/css/usersmanage.css">
    <script src="./static/js/js.cookie.min.js"></script>
    <style>
        .checkOn {
            background-color: rgb(255, 255, 255);
        }
    </style>

</head>

<body style="background: rgb(221, 225, 234);">

    <div id='root' v-loading="isLoading">
        <!-- 正文内容 -->
        <div class="rightRound"></div>
        <div class="rightSmallRound"></div>
        <div class="leftRound"></div>
        <div class="navigate">
            <a class="span1" href="membermanagement.html">成员管理</a>
            <a class="span2" href="#">用户管理</a>
        </div>
        <div class="context">
            <div class="leftContext">
                <div class="leftContextHeader">
                    <div style="width:50%;display: flex;align-items: center;">
                        <image class="doll" src="./static/images/doll.png">
                        </image>
                        <span
                            style="color: rgb(56, 41, 122); font-size:28px; font-weight:400;margin-left: 10vw;">用户列表</span>
                    </div>
                    <div style="width: 50%;display: flex;align-items: center;justify-content: space-between;">
                        <div class="flexCenter refresh" @click="getMessage">
                            <span style="cursor: default;">刷新</span>
                            <image class="" src="./static/images/refresh.svg" mode="widthFix">

                            </image>
                        </div>
                        <!-- 搜索区域 -->
                        <div class="inputBox">
                            <input type="text" placeholder="name/openid" id="searchInfo" v-model="keyword">
                            <image @click="searchUser"
                                src="https://636c-cloud1-8g54d6xb74e96e7d-1311924947.tcb.qcloud.la/images/%E6%90%9C%E7%B4%A2.svg?sign=d416a60168e68c98bef4026732124e8f&t=1660894534"
                                mode="widthFix" lazy-load="false" binderror="" bindload="">
                            </image>
                        </div>

                    </div>
                </div>

                <div class="ContextTable" style="overflow: auto;">

                    <table id="table" cellspacing="20" style="overflow:auto;
                    width: 100%; position: relative;">
                        <thead class="tableHeader"
                            style="width: 100%;position: sticky;top: 0;background-color: rgb(247, 248, 250);padding:10px 0px ;margin-top: 10px;">
                            <tr>
                                <th style="width: 20%;">openid</th>
                                <th style="width: 20%;">姓名</th>
                                <th style="width: 20%;">隶属部门</th>
                                <th style="width: 20%;">职位</th>
                                <!-- 默认状态隐藏 -->
                                <th v-if="progressInfo=='inputMessage'?true:false">操作</th>

                            </tr>
                        </thead>
                        <tbody style="margin-top: 20%;">
                            <template v-for="(p,index) of list">
                                <tr style="height: 20%">
                                    <td>{{p._openid}}</td>
                                    <td>{{p.realName}}</td>
                                    <td>{{p.department}}</td>
                                    <td>{{p.Position}}</td>
                                    <!--style=" 默认状态隐藏 -->
                                    <td class="manage" v-if="progressInfo=='inputMessage'?true:false">
                                        <!-- <button @click="changeUser(p._openid)"></button> -->
                                        <button @click="alertWindows(p._openid,p.realName,p.department,p.Position)"
                                            style="background-color:rgb(234, 234, 234);
                                            border-radius:5px;
                                            border:1px solid;width: 45px;padding:5px;">修改</button>
                                        <button @click="deleteUser(p._openid,p.realName,index)" style="margin-left: 5px;width: 45px;padding:5px;border-radius: 5px;color: #fff;background-color: rgb(255, 110, 110);border:0px
                                    ">删除</button>
                                    </td>
                                </tr>
                            </template>

                            <!-- 一个案例 -->
                            <!-- <tr>
                                <td>o4HIE4xePfxmP7ABBBvDafNJb6lQ</td>
                                <td>黄伟聪</td>
                                <td>网络研发部</td>
                                <td>副部长</td>
                                <td>
                                </td>
                            </tr> -->
                        </tbody>
                    </table>
                </div>

            </div>
            <div class="rightContext " style="display: flex; flex-direction:column;align-items: center;">
                <!-- 头像 -->
                <div style="display: flex; flex-direction:column;align-items: center; margin-bottom: 30px;">
                    <image class="" src="./static/images/icon.svg" mode="widthFix" style="width: 56px">
                        <span style="font-size: 14px;">{{personInfo.realName}}</span>
                    </image>
                </div>
                <!-- 功能显示 -->
                <div style="margin-bottom: 40px;color: rgb(51, 44, 122);" id="manageInfo">新增运营用户</div>
                <!-- 进度显示 -->
                <div class=" rightMenu"
                    style="margin-bottom: 20px;display: flex;justify-content: space-between;align-items: center;">
                    <ul id="authority1" :class="authority==1?'checkOn':'normal'"
                        style='padding: 4px;border-radius: 4px;margin-left: 5px;'>
                        <image class="" src="./static/images/checkAuthority.svg" mode="aspectFit|aspectFill|widthFix"
                            lazy-load="false" binderror="" bindload="" style="vertical-align: middle">
                        </image> 验证权限
                    </ul>
                    <ul id="authority2" :class="authority==2?'checkOn':'normal'"
                        style='padding: 4px;border-radius: 4px; '>
                        <image class="" src="./static/images/inputMessage.svg" mode="aspectFit|aspectFill|widthFix"
                            lazy-load="false" binderror="" bindload="" style="vertical-align: middle">
                        </image> 填写信息
                    </ul>
                    <ul id="authority3" :class="authority==3?'checkOn':'normal'"
                        style='padding: 4px;border-radius: 4px; '>
                        <image class="" src="./static/images/addSuccess.svg" mode="aspectFit|aspectFill|widthFix"
                            lazy-load="false" binderror="" bindload="" style="vertical-align: middle">

                        </image> 添加完成
                    </ul>
                </div>
                <!-- 操作区域 -->
                <!-- 密码验证区域 -->
                <template v-if="progressInfo=='authority'?true:false">
                    <div
                        style="height: 38%;display: flex;flex-direction: column;justify-content: space-around;align-items: center;">

                        <div>需要最高权限密码</div>
                        <div style="background: rgb(255, 255, 255);
                    border-radius: 5px;margin-top: -20%;">

                            <div class="flexCenter authorityInput">
                                <image class="passwordImg" src="./static/images/lock.svg" mode="widthFix"
                                    lazy-load="false" binderror="" bindload="" @click="setPassword">
                                </image>
                                <input type="password"
                                    style='width:80%;height:80%;margin-left:12px;border: none;outline: none;;'
                                    placeholder="password" class="passwordInput" @keyup.enter="verifyPassword">
                            </div>
                        </div>
                    </div>
                    <div class="Button " style="width:90%;display: flex;justify-content: space-around;">
                        <button class="button" @click="resetPasswordInput"
                            style="background-color: rgb(255, 255, 255);color: rgb(129, 129, 129);box-shadow: 3px 2px 3px rgb(255, 255, 255);">重置</button>
                        <button @click="verifyPassword"
                            style="background-color: rgb(56, 41, 122);color: rgb(255, 255, 255);">确定</button>
                    </div>
                </template>
                <!-- 添加用户 -->
                <template v-if="progressInfo=='inputMessage'?true:false">
                    <div style="margin-bottom: 30px" class="inputInfo">
                        <div><span>姓名</span> <input type="text" id="name" placeholder="成员真实姓名" v-model="inputrealName">
                        </div>
                        <div><span>_openid</span><input type="text" id="_openid" placeholder="自定义"
                                v-model="inputopenid"></div>
                        <div><span>密码</span><input v-model="inputpassword" type="text" id="password"
                                placeholder="不少于8位字符">
                        </div>
                        <div><span>确认密码</span><input v-model="confirmPassword" type="text" id="confirmPassword"
                                placeholder="不少于8位字符"></div>
                        <!-- 提示信息 -->
                        <div style="height: 1%;"><span id="Tip"></span></div>
                        <div><span>隶属部门</span><select name="" id="department" class="selectBox"
                                v-model="inputdepartment">
                                <option value="" style="display: none"></option>
                                <option value="网络研发部">网络研发部</option>
                                <option value="秘书处">秘书处</option>
                                <option value="UI设计部">UI设计部</option>
                                <option value="PC技术部">PC技术部</option>
                                <option value="宣传部">宣传部</option>
                                <option value="动画部">动画部</option>
                                <option value="新媒体运营">新媒体运营</option>
                                <option value="影视部">影视部</option>
                            </select></div>
                        <div><span>职位</span><select name="" id="Position" class="selectBox" v-model="inputPosition">
                                <option value="" style="display: none"></option>
                                <option value="正部长">正部长</option>
                                <option value="副部长">副部长</option>
                            </select></div>
                        <div><span>email</span> <input type="text" id="email" placeholder="email" v-model="inputemail">
                        </div>

                    </div>
                    <div class="Button " style="width:90%;display: flex;justify-content: space-around;">
                        <button class="button" @click="resetInputMessage"
                            style="background-color: rgb(255, 255, 255);color: rgb(129, 129, 129);box-shadow: 3px 2px 3px rgb(255, 255, 255);">重置</button>
                        <button @click="addUsers"
                            style="background-color: rgb(56, 41, 122);color: rgb(255, 255, 255);">确定</button>
                    </div>
                </template>
                <!-- 成功 -->
                <template v-if="progressInfo=='success'?true:false">
                    <div
                        style="height: 80%;display: flex;flex-direction: column;justify-content: space-around;align-items: center;">

                        <image src="./static/images/success.svg" mode="widthFix" style="width:80%">
                        </image>

                        <div style="color: rgb(51, 44, 122);">添加成功</div>

                        <button @click="Tab2"
                            style="background-color:rgb(56, 41, 122);height: 10%; width: 90%;font-weight: 700;color: rgb(255, 255, 255);">继续添加</button>
                    </div>
                </template>
            </div>
        </div>


        <!-- 弹窗 -->
        <div id="myModal" class="modal" v-show="showModal">
            <!-- 弹窗内容 -->
            <div class="modal-content">
                <div class="modal-header">
                    <span class="close" @click="showModal=false">&times;</span>
                    <h2>修改用户信息</h2>
                </div>
                <div class="modal-body">
                    <div><span>_openid:</span>{{openid}}</div>
                    <div><span>姓名:</span> <input type="text" v-model="realName" class="windowsInput"></div>
                    <div><span>隶属部门:</span>
                        <select v-model="department" class="windowsInput">
                            <option value="" style="display: none"></option>
                            <option value="网络研发部">网络研发部</option>
                            <option value="秘书处">秘书处</option>
                            <option value="UI设计部">UI设计部</option>
                            <option value="PC技术部">PC技术部</option>
                            <option value="宣传部">宣传部</option>
                            <option value="动画部">动画部</option>
                            <option value="新媒体运营">新媒体运营</option>
                            <option value="影视部">影视部</option>
                        </select>
                    </div>
                    <div><span>职位:</span>
                        <select name="" v-model="Position" class="windowsInput">
                            <option value="" style="display: none"></option>
                            <option value="正部长">正部长</option>
                            <option value="副部长">副部长</option>
                        </select>

                    </div>
                    <button @click="changUser" style="height: 30px;font-weight: 700;">确定修改</button>
                </div>
                <div class="modal-footer">
                    <p style="text-align: right;">@By——网络研发部</p>
                </div>
            </div>

        </div>
    </div>

</body>
<scrri>

    <script>
        Vue.prototype.Cookie = window.Cookies

        const Max_Get = 20 //一次性最多获取的云数据库的数量
        //将微信挂载在Window上的cloud挂载到vue实例上
        const c = window.cloud
        Vue.prototype.cloud = c
        Vue.config.productionTip = false //阻止vue在启动时生成生产提示
        Vue.config.devtools = true;
        const vm = new Vue({
            el: '#root',
            data() {
                return {
                    progressInfo: 'authority',
                    //inputMessage输入信息
                    usersInfo: [], //用户对象.
                    password: '',//弹窗的密码
                    inputpassword: '',//输入的密码
                    confirmPassword: '',//确认密码
                    openid: '',//保存的临时
                    inputopenid: '',
                    realName: "",
                    inputrealName: '',//保存的输入用户名
                    department: "网络研发部",
                    inputdepartment: '网络研发部',//输入的部门
                    email: '',
                    inputemail: '',
                    inputPosition: '',
                    Position: '',
                    keyword: '',
                    list: [],
                    personInfo: {},//保存的cookie数据对象,
                    authority: 1,//控制 显示转态,
                    showModal: false,
                    isLoading: false,//控制整个窗口是否显示加载
                }
            },
            methods: {
                renewList() {
                    this.list = this.usersInfo.filter((p) => {
                        return ((p.realName ? (p.realName.indexOf(val) !== -1) : null) || (p.Position ? (p.Position.indexOf(val) !== -1) : null) || (p._openid ? (p._openid.indexOf(val) !== -1) : null))
                    })
                },
                checkCookie() {
                    // 如果存在cookie
                    if (this.Cookie.get("personInfo")) {
                        let info = JSON.parse(this.Cookie.get("personInfo"));
                        if (info) {
                            // console.log("用户已经登录");
                            // console.log("本地cookie为");
                            // console.log(info);
                            //对cookie内容进行校验
                            console.log(info._openid);
                            this.db.collection("operationUsers").where({
                                _openid: info._openid
                            }).get().then(res => {
                                //使用密码进行判断
                                if (res.data[0].webPassword == info.webPassword) {
                                    console.log("cookie正确");
                                    this.personInfo = info

                                } else {

                                    this.$message({
                                        message: '请勿盗用他人cookie',
                                        type: 'error'
                                    });
                                    location.href = "./index.html"
                                }
                            })
                        }
                        else {
                            console.log("用户未登录");
                            location.href = "./index.html"
                            // let personInfo={a:1,b:2}
                            // let jsontoString=JSON.stringify(personInfo)
                            // this.Cookie.set("personInfo",jsontoString,{expires:1})
                        }
                    } else {

                        this.$message({
                            message: '请登录',
                            type: 'warning'
                        });
                        location.href = './index.html'
                    }

                },
                //配置微信
                async initWx() {
                    //创建新的cloud实例
                    var c1 = new this.cloud.Cloud({
                        identityless: true,
                        // 资源方 AppID 填自己的
                        resourceAppid: 'wx96f760966921f98a',
                        // 资源方环境 ID	填自己的
                        resourceEnv: 'cloud1-8g54d6xb74e96e7d'
                    })
                    //初始化,使用await将异步转化为同步
                    await c1.init()
                    console.log('初始化完成');
                    this.cloud = c1
                    this.db = this.cloud.database()
                },
                resetInputMessage() {
                    this.inputrealName = ''
                    this.inputopenid = ''
                    this.inputpassword = ''
                    this.confirmPassword = ''
                    this.inputdepartment = ''
                    this.inputPosition = ''

                },
                //认证界面
                Tab1() {
                    this.progressInfo = 'authority'
                    console.log("点击了");
                    this.authority = 1
                },
                //填写信息界面
                Tab2() {
                    $("#password").val("")
                    // $("#confirmPassword").val("")
                    this.progressInfo = "inputMessage";
                    this.authority = 2;

                    // $("#authority1").css('background-color', '')
                    // $("#authority2").css('background-color', 'rgb(255,255,255)')
                    // $("#authority3").css('background-color', '')

                },
                // 认证成功界面
                Tab3() {
                    this.progressInfo = "success";
                    this.authority = 3
                    // $("#authority1").css('background-color', '')
                    // $("#authority2").css('background-color', '')
                    // $("#authority3").css('background-color', 'rgb(255,255,255)')
                },
                setPassword() {
                    if ([$('.passwordInput').attr('type')] == 'password') {
                        $('.passwordInput').attr('type', 'text')
                        $('.passwordImg').attr('src', '/static/images/unlock.svg')

                    } else {
                        $('.passwordInput').attr('type', 'password');
                        $('.passwordImg').attr('src', '/static/images/lock.svg')

                    }
                },
                //重置密码框
                resetPasswordInput() {
                    $('.passwordInput').val('');
                },
                //验证密码吗
                async verifyPassword() {
                    var input = $('.passwordInput').val();
                    console.log(input);
                    if (input) {
                        // 调用云函数进行验证
                        await this.cloud.callFunction({
                            name: 'verifyPassword',
                            data: {
                                input: input
                            },
                            success: res => {
                                console.log(res);
                                if (res.result.result == 0) {
                                    console.log('认证成功');
                                    this.$message({
                                        type: 'success',
                                        message: "认证成功"
                                    })
                                    this.Tab2();
                                } else {
                                    console.log("认证失败");

                                    this.$message({
                                        type: 'error',
                                        message: "密码错误，请联系管理人员获取正确密码"
                                    })
                                }
                            },
                            fail: error => {
                                console.log(error);
                            }

                        })
                    } else {

                        this.$message({
                            message: '认证密码不能为空',
                            type: 'error'
                        });
                    }



                },

                // 获取用户信息
                async getMessage() {
                    // 统计数量
                    await this.db.collection("operationUsers").count().then(async res => {
                        console.log("获取的数量为");
                        var total = res.total;
                        var getNumber = Math.ceil(total / Max_Get); //分批获取的次数
                        var oldData = [];
                        console.log(getNumber);
                        // 进行分批获取
                        for (let i = 0; i < getNumber; i++) {
                            await this.db.collection("operationUsers").skip(i * 20).get().then(res => {
                                oldData = oldData.concat(res.data); //储存数据
                            }
                            )
                        }
                        //储存保存的数据
                        var dataArray = oldData
                        var arraryLength = oldData.length
                        this.usersInfo.splice(0, this.usersInfo.length)
                        for (let i = 0; i < arraryLength; i++) {
                            this.usersInfo.push(dataArray[i])
                        }
                        console.log(this.usersInfo);

                    })

                    this.list = this.usersInfo;

                }
                ,
                //判断邮箱
                checkinputEmail(email) {
                    let str = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/;

                    if (str.test(email)) {

                        return true

                    } else {
                        return false
                    }
                },
                //添加用户
                async addUsers() {
                    var name = this.inputrealName
                    var _openid = this.inputopenid
                    var password = this.inputpassword
                    var department = this.inputdepartment
                    var Position = this.inputPosition
                    var email = this.inputemail
                    console.log(Position);
                    if (!name || !_openid || !password || !confirmPassword || !department || !Position || !department || !Position || !email) {

                        this.$message({
                            message: '请完善信息',
                            type: 'warning'
                        });
                    }
                    else {
                        // 判断邮箱格式
                        let checkFormat = this.checkinputEmail(this.inputemail)
                        if (checkFormat) {
                            await this.db.collection("operationUsers").add(
                                {
                                    data: {
                                        realName: name,
                                        _openid: _openid,
                                        webPassword: password,
                                        department: department,
                                        Position: Position,
                                        email: email
                                    }
                                }
                            ).then(res => {
                                console.log(res);
                                if (res.errMsg = 'collection.add:ok') {
                                    this.$message({
                                        message: '添加成功',
                                        type: 'success'
                                    });
                                    //清除输入的东西
                                    this.resetInputMessage();
                                    this.Tab3()
                                }
                            })
                        } else {

                            this.$message({
                                type: 'error',
                                message: '邮箱格式有问题，请重新输入'
                            })
                        }

                    }
                },
                //搜索用户  ---by realName
                searchUser() {
                    var searchInfo = this.keyword
                    var inquiryInfo = searchInfo + '+.*';

                    console.log(inquiryInfo);
                    var db = this.db
                    this.db.collection("operationUsers").where({
                        realName: db.RegExp({
                            regexp: inquiryInfo,
                            option: 'i'
                        })
                    }).get().then(res => {
                        var dataArray = res.data;
                        //清空
                        this.usersInfo.splice(0, this.usersInfo.length)
                        console.log(this.usersInfo);
                        for (let i = 0; i < dataArray.length; i++) {
                            this.usersInfo.push(dataArray[i])
                        }
                    })

                }
                ,
                //修改用户信息
                changUser() {
                    this.db.collection('operationUsers').where({
                        _openid: this.openid
                    }).update({
                        data: {
                            realName: this.realName,
                            department: this.department,
                            Position: this.Position
                        }
                    }).then(res => {
                        console.log(res);
                        if (res.stats.updated) {
                            // window.alert("修改成功")
                            this.$message({
                                type: 'success',
                                message: '修改成功'
                            })
                            // 关闭窗口
                            // $(".modal").css('display', 'none')
                            this.showModal = false;
                            //修改后重新修改getmessage
                            this.getMessage();
                            this.renewList();

                        }
                    })
                },
                // 删除用户
                deleteUser(_openid, realName, index) {
                    console.log(_openid);
                    var message = "确认删除" + realName + "吗？"
                    this.$confirm(message, '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {

                        this.db.collection('operationUsers').where(
                            {
                                _openid: _openid
                            }).remove({
                                success: res => {
                                    this.$message({
                                        type: 'success',
                                        message: '删除成功!'
                                    });
                                    console.log(res);
                                    this.usersInfo.splice(index, 1)
                                }
                            })

                    }).catch(() => {
                        // this.$message({
                        //     type: 'info',
                        //     message: '已取消删除'
                        // });
                    });
                },
                alertWindows(_openid, realName, department, Position) {

                    // 显示
                    // $("#myModal").css('display', 'block');

                    // 关闭
                    // $(".close").bind("click", function () {
                    //     $("#myModal").css('display', 'none');


                    console.log(_openid);
                    // // })
                    this.showModal = true;
                    this.openid = _openid
                    this.realName = realName
                    this.department = department
                    this.Position = Position


                }
            },
            watch: {
                confirmPassword(newValue) {
                    console.log(newValue);
                    if (newValue != this.inputpassword) {
                        console.log('两次输入的密码不同');
                        $("#Tip").text("两次输入的密码不同")
                        $("#Tip").css("color", 'red')
                    } else {
                        $("#Tip").text("")
                    }
                },
                password(newValue) {
                    console.log(newValue);
                    if (newValue != this.confirmPassword) {
                        console.log('两次输入的密码不同');
                        $("#Tip").text("两次输入的密码不同")
                        $("#Tip").css("color", 'red')
                    } else {
                        $("#Tip").text("")
                    }
                },
                keyword: {
                    deep: true,
                    handler(val) {
                        console.log(val);
                        this.list = this.usersInfo.filter((p) => {
                            return ((p.realName ? (p.realName.indexOf(val) !== -1) : null) || (p.Position ? (p.Position.indexOf(val) !== -1) : null) || (p._openid ? (p._openid.indexOf(val) !== -1) : null))
                        })
                    }

                },
                //检测personinfo的变化
                personInfo: {
                    deep: true,
                    handler(val) {
                        this.list = this.personInfo
                    }
                },
                isPhone() {
        //获取浏览器navigator对象的userAgent属性（浏览器用于HTTP请求的用户代理头的值）
        var info = navigator.userAgent;
        //通过正则表达式的test方法判断是否包含“Mobile”字符串
        var isPhone = /mobile/i.test(info);
        //如果包含“Mobile”（是手机设备）则返回true
        if(isPhone){
            this.$message({
                            message: '为了方便您的使用,请使用电脑登录',
                            type: 'error'
                        });
                        location.href = "./error.html"
                        
        }else{
            // this.$message({
            //                 message: '电脑端登录',
            //                 type: 'success'
            //             });
        }
            }
            },
            computed: {


            },
            async created() {

                await this.initWx();
                this.checkCookie();//必须在初始化后，因为要用到云数据库

                //获取列表数据
                this.getMessage();
                this.isPhone();



            },
            mounted() {
                //一开始对list 进行初始化。
                this.list = this.usersInfo


            },
        })
    </script>
</scrri>

</html>